<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/manage' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>订单管理</el-breadcrumb-item>
      <el-breadcrumb-item>订单流水</el-breadcrumb-item>
    </el-breadcrumb>
    <el-table :data="list" size="small">
      <el-table-column label="创建时间" width="170">
        <template slot-scope="scope">
          <span>{{ new Date(scope.row.gmtCreate).toLocaleString() }}</span>
        </template>
      </el-table-column>
      <el-table-column label="来源">
        <template slot-scope="scope">
          <span>{{ orderType[scope.row.buyerType] }}</span>
        </template>
      </el-table-column>
      <el-table-column label="支付">
        <template slot-scope="scope">
          <span>{{ payType[scope.row.payFrom] }}</span>
        </template>
      </el-table-column>
      <el-table-column label="订单实付款">
        <template slot-scope="scope">
          <span style="color: #19be6b; font-weight: 800;">+{{ scope.row.orderActualPayment / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="订单收入">
        <template slot-scope="scope">
          <span style="color: #19be6b; font-weight: 800;">+{{ scope.row.matrixIncomeAmount / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="分体扣点金额">
        <template slot-scope="scope">
          <span style="color: #ed3f14; font-weight: 800;">-{{ scope.row.branchDeductAmount / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="代理商收入">
        <template slot-scope="scope">
          <span style="color: #19be6b;font-weight: 800;">+{{ scope.row.agentIncomeAmount / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="分销商收入">
        <template slot-scope="scope">
          <span style="color: #19be6b;font-weight: 800;">+{{ scope.row.distributorIncomeAmount / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="分销商扣点金额">
        <template slot-scope="scope">
          <span style="color: #ed3f14;font-weight: 800;">-{{ scope.row.distributorDeductAmount / 100 }}￥</span>
        </template>
      </el-table-column>
      <el-table-column label="总扣点金额">
        <template slot-scope="scope">
          <span style="color: #ed3f14;">-{{ scope.row.deductTotal / 100 }}￥</span>
        </template>
      </el-table-column>
      <!--<el-table-column label="支付完成时间" width="170">
        <template slot-scope="scope">
          <span>{{ new Date(scope.row.payCompleteTime).toLocaleString() }}</span>
        </template>
      </el-table-column>-->
    </el-table>
    <div style="overflow: hidden;">
      <div style="float: right;">
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="page.pageNum"
          :page-sizes="[10, 15, 20, 25]"
          :page-size="page.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="400">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'distribution',
  data () {
    return {
      list: [],
      orderType: [null, '分体', '分销商'],
      payType: [null, '微信', '余额'],
      page: {
        pageNum: 1,
        pageSize: 10,
        total: 0
      }
    }
  },
  methods: {
    handleCurrentChange (num) {
      this.page.pageNum = num
      this.initList()
    },
    handleSizeChange (size) {
      this.page.pageSize = size
      this.initList()
    },
    initList () {
      this.$ajax.post('/matrix/order/payment/distribution/list', {pageNum: this.page.pageNum, pageSize: this.page.pageSize})
        .then(res => {
          if (res.data.success) {
            this.list = res.data.data.list
            this.page.total = res.data.data.total
          }
        })
    }
  },
  created () {
    this.initList()
  }
}
</script>

<style scoped>

</style>
